﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Search.aspx.cs" Inherits="Things.Web.Search" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .d
        {
            width: 650px;
        }
        .d ul
        {
            margin: 0px;
            list-style-type: none;
        }
        .d1
        {
            float: left;
            width: 200px;
            height: 200px;
        }
    </style>
    <script src="js/jquery-1.7.1.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div class="d" id="plist">
        <ul>
            <asp:DataList ID="DataList1" runat="server" RepeatColumns="3">
                <ItemTemplate>
                    <li class="d1">
                        <div>
                            <asp:Image ID="Image1" runat="server" src2='<%# Eval("ImageURL") %>' ImageUrl="/Images/Loading.gif"
                                Width="160px" />
                        </div>
                        <div>
                            <asp:LinkButton ID="LinkButton1" runat="server" Text='<%# Eval("GoodsName") %>'></asp:LinkButton>
                        </div>
                        <div>
                            <asp:Label ID="Label1" runat="server" Text='<%# "市场价："+ Eval("GoodsStandPrice") %>'></asp:Label>
                        </div>
                        <div>
                            <asp:Label ID="Label2" runat="server" Text='<%# "当前价："+Eval("GoodsCurrentPrice") %>'></asp:Label>
                        </div>
                    </li>
                </ItemTemplate>
            </asp:DataList>
        </ul>
    </div>
    </form>
    <script language="javascript" type="text/javascript">

        function lazyload(option) {
            var settings = {
                defObj: null,
                defHeight: 0
            };
            settings = $.extend(settings, option || {});
            var defHeight = settings.defHeight, defObj = (typeof settings.defObj == "object") ? settings.defObj.find("img") : $(settings.defObj).find("img");
            var pageTop = function () {
                return document.documentElement.clientHeight + Math.max(document.documentElement.scrollTop, document.body.scrollTop) - settings.defHeight;
            };
            var imgLoad = function () {
                defObj.each(function () {
                    if ($(this).offset().top <= pageTop()) {
                        var src2 = $(this).attr("src2");
                        if (src2) {
                            $(this).attr("src", src2).removeAttr("src2");
                        }
                    }
                });
            };
            imgLoad();

            // 绑定滚动事件 
            $(window).bind("scroll", function () {
                imgLoad();
            });
        }

        lazyload({
            defObj: "#plist"
        })
    </script>
</body>
</html>
